{
    function sendMessage() {

        let message = $("#sendMessage").val();
        console.log(message)
        let fromData = {
            "message": message,
        }

        $.ajax({
            url:"sendMessageServlet",//当前ajax访问地址
            data:fromData,//表示当前ajax携带的数据
            type:"post",//当前请求的类型 ,通常是 post 或者 get
            dataType:"json",//指的是ajax 要求服务器应该返回扫描数据
            success :function (res){//表示当响应成功时候返回的参数
                console.log(res)
                if (res.code===200){
                    alert(res.msg)
                    init()
                }else {
                    alert(res.msg)

                }
            },
            error:function (e1,e2,e3){//当访问失败时候执行的
                console.log(e1)
                console.log(e2)
                console.log(e3)
            }
        })

    }

// 生成指定范围随机数（保留小数点后两位）
    function randomNum(min, max) {
        var num = (Math.random() * (max - min + 1) + min).toFixed(2);
        return num;
    }
// 初始函数
    function init() {
        $("div.word").empty();
        $("div.word").removeClass();
        let words;
        $.ajax({
            url: "leaveMessageServlet",//当前ajax访问地址
            data: "",//表示当前ajax携带的数据
            type: "post",//当前请求的类型 ,通常是 post 或者 get
            dataType: "json",//指的是ajax 要求服务器应该返回扫描数据
            success: function (res) {//表示当响应成功时候返回的参数
                console.log(res)
                words = res.messages
                let container = document.querySelector('.container');
                let f = document.createDocumentFragment(); //创建文档片段对象
                words.forEach(w => {
                    let word_box = document.createElement('div');
                    let word = document.createElement('div');

                    word.innerText = w;
                    word.classList.add('word');

                    // 随机生成色相值（0为红色、120为绿色、240为蓝色、360为红色）
                    let hue = randomNum(0, 240);
                    word.style.color = 'hsl(' + hue + ',100%,65%)';

                    word_box.classList.add('word-box');
                    // 生成随机数值，并赋值给自定义属性
                    word_box.style.setProperty('--margin-top', randomNum(-40, 20) + 'vh');
                    word_box.style.setProperty('--margin-left', randomNum(6, 35) + 'vw');
                    word_box.style.setProperty('--animation-duration', randomNum(8, 20) + 's');
                    word_box.style.setProperty('--animation-delay', randomNum(-20, 0) + 's');
                    word_box.appendChild(word);
                    f.appendChild(word_box);
                })
                container.appendChild(f);
            },
            error: function (e1, e2, e3) {//当访问失败时候执行的
                console.log(e1)
                console.log(e2)
                console.log(e3)

            }
        })

    }

// 绑定加载事件
    window.addEventListener('load', init);
}

